﻿@model Himall.Model.TopicInfo

@{
    ViewBag.Title = Model.Name;
}

<script type="text/javascript">
    $(function () {
        //banner自动居中
        @*var selfDefineText = '@Model.SelfDefineText';
        if (selfDefineText == '') {
            var img = new Image();
            img.src = "@Model.TopImage";
            img.onload = function () {
                $('.topic-banner').height(img.height);
                var left = -img.width / 2;
                $('.topic-banner a').html("<img style='margin-left:" + left + "px' src='" + img.src + "' />");
            }
        }
        else {
            $('.topic-banner').empty().append($(selfDefineText));
        }*@



        //右侧导航
        $(".topic-nav li").click(function () {
            var currentE = $(".topic .topic-goods").eq($(this).index());
            $("html,body").stop().animate({ scrollTop: currentE.offset().top + 20 }, 500);
        });
        if ($('.topic-goods').length > 0) {
            $(window).scroll(function () {
                if ($(document).scrollTop() > ($('.topic-goods').first().offset().top - 350)) {
                    $('.topic-nav').show()
                } else {
                    $('.topic-nav').hide()
                }

                $(".topic .w .topic-goods").each(function () {
                    if ($(this).offset().top <= $(document).scrollTop() + 100) {
                        $(".topic-nav li").eq($(this).index()).addClass("cur").siblings().removeClass();
                    }
                })
            });
        }

    });
</script>
@if (Model != null)
{
    <div class="topic" style="background-image:url(@Model.BackgroundImage)">
        <div class="topic-html">
            @MvcHtmlString.Create(Model.SelfDefineText)
            @*<a href="#">
                @*<img src="@Model.TopImage" alt="" width="1920" height="460" />
            </a>*@
        </div>
        <div class="topic-nav">
            <ul>
                @{
                string className = "";
                for (int i = 0; i < Model.TopicModuleInfo.Count(); i++)
                {
                    className = i == 0 ? "curr" : "";
                    <li class="@className"><a href="javacript:void(0)">@(Model.TopicModuleInfo.ElementAt(i).Name)</a></li>
                }
                }
            </ul>
            <b></b>
        </div>
        <div class="w cl">
            @for (int i = 0; i < Model.TopicModuleInfo.Count(); i++)
        {
        <div class="topic-goods">
            <h3 class="topic-title">@(Model.TopicModuleInfo.ElementAt(i).Name)</h3>
            <ul class="cl">
                @foreach (var product in Model.TopicModuleInfo.ElementAt(i).ModuleProductInfo)
                {
                <li>
                    <div class="p-img">
                        <a href="@Url.Action("Detail", "Product", new { id = product.ProductId })" target="_blank" title="">
                            <img class="lazyload" src="~/Areas/Web/images/blank.gif" data-url="@product.ProductInfo.ImagePath/1_220.png" />
                        </a>
                    </div>
                    <div class="p-name"><a href="@Url.Action("Detail", "Product", new { id = product.ProductId })" target="_blank" title="">@product.ProductInfo.ProductName</a></div>
                    <div class="p-price">￥@product.ProductInfo.MinSalePrice</div><a href="@Url.Action("Detail", "Product", new { id = product.ProductId })" target="_blank" class="btn-buy">立即抢购</a>
                </li>
                }
            </ul>
        </div>
        }

        </div>
    </div>
}
